<template>
  <div class="home">
    <img alt="Vue logo" src="../assets/logo.png">
    <router-link to="/home/news">新闻</router-link> |
    <router-link to="/home/message">消息</router-link>
    <hr>
<!--    <HelloWorld msg="Welcome to Your Vue.js App" />-->
    <keep-alive>
      <router-view />
    </keep-alive>
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'

export default {
  name: 'Home',
  data: () => ({
    activePath: '/home/news'
  }),
  components: {
    HelloWorld
  },
  created() {
    console.log('home created');
  },
  destroyed() {
    console.log('home destroyed');
  },
  /**
   * activated 和 deactivated 只有在被 keep-alive 保持的时候才有效
   **/
  activated() { // 当前组件激活时调用
    this.$router.push(this.activePath);
  },
  beforeRouteLeave(to, from, next) {
    this.activePath = from.path; // 保存最后的数据状态
    next();
  }
}
</script>
